<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>填写贷款</title>
    <script th:src="@{/script/jquery-1.12.4.js}"></script>
    <link rel="stylesheet" th:href="@{/css/bootstrap.css}"/>
    <link rel="stylesheet" th:href="@{/css/apply.css}"/>
    <script th:src="@{/script/bootstrap.js}"></script>
    <script th:src="@{/bootstrap/js/city-picker.data.js}"></script>
    <script th:src="@{/bootstrap/js/city-picker.js}"></script>
    <link rel="stylesheet" th:href="@{/bootstrap/css/city-picker.css}" type="text/css"/>
    <link rel="stylesheet" th:href="@{/css/bootstrapValidator.css}"/>
    <link rel="stylesheet" th:href="@{/css/bootstrapValidator.min.css}"/>
    <script th:src="@{/script/bootstrapValidator.min.js}"></script>
    <link rel="stylesheet" th:href="@{/css/common.css}"/>
    <link rel="stylesheet" th:href="@{/css/index.css}" type="text/css">
    <script th:src="@{/script/common.js}" type="text/javascript"></script>
    <script th:src="@{/script/vue.min.js}" type="text/javascript"></script>
    <script th:src="@{/script/axios.min.js}" type="text/javascript"></script>
    <script type="text/javascript">
        // 上下滚动
        function AutoScroll(obj) {
            $(obj).find("ul:first").animate({
                    marginTop: "-25px"
                },
                500,
                function () {
                    $(this).css({
                        marginTop: "0px"
                    }).find("li:first").appendTo(this);
                });
        }

        $(document).ready(function () {
            var myar = setInterval('AutoScroll("#scrollDiv")', 3000);
            $("#scrollDiv").hover(function () {
                    clearInterval(myar);
                },
                function () {
                    myar = setInterval('AutoScroll("#scrollDiv")', 3000)
                }); //当鼠标放上去的时候，滚动停止，鼠标离开的时候滚动开始
        });
    </script>
</head>
<body>
<div class="container-fluid">
    <div class="row">
        <div th:replace="loan/public::head"></div>
    </div>
    <div class="row">
        <a style="text-decoration: none;
    margin-left: 202px;
    margin-top: 55px;
    display: inline-block;" th:href="@{/loan/loanmian}">首页 > <a style="text-decoration: none;" th:href="@{/loan/credit_5}">汽车抵押贷 > </a><a
                style="text-decoration: none;" th:href="@{/loan/application(applyid=${session.applyid},loantype=${session.loantype})}">填写贷款信息 > </a><span
                style="color: #D0D0D0">添加相关证件<span><a style="margin-left: 597px;
    color: darkcyan;" th:href="@{/loan/addcar}">添加相关证件</a>
        <div class="creditapply">
            <h3 class="xiangqing">提供相关证件</h3>
                    <div style="width: 242px;
    height: 300px;
    border: 1px solid #ccc; box-shadow:2px 2px 10px 2px rgba(0, 0, 0, 0.61);margin: 30px 0px 0px 380px;" th:each="entry:${session.carimf}">
                        <h3 style="font-size: 14px;
    margin: 18px 0px 0px 30px;">车辆名称：<span th:text="${entry.carname}"></span></h3>
                        <h3 style="font-size: 14px;
    margin: 10px 0px 0px 30px;">车牌号：<span th:text="${entry.caridcard}"></span></h3>
                        <h3 style="font-size: 14px;
    margin: 10px 0px 0px 30px;">车辆拥有时间：<span th:text="${entry.cardate}"></span></h3>
                        <h3 style="font-size: 14px;
    margin: 10px 0px 0px 30px;">机动车登记证书</h3>
                        <img style="    width: 200px;
    height: 120px;
    margin: 10px 0px 0px 20px;" th:src="@{${entry.carprove}}"/>

                        <a class="btn btn-primary" id="btn" style="margin-left: 84px;
    margin-top: 16px;border: none" th:href="@{/loan/prove(carid=${entry.id},applyid=${session.applyid})}" th:if="${entry.carowner}==0" type="submit">确认抵押</a>
                        <a class="btn btn-primary" href="#" id="btn" style="margin-left: 84px;
    margin-top: 16px;background-color: darksalmon;border: none" th:if="${entry.carowner}==1" type="submit">已抵押</a>
                    </div>
        </div>
    </div>
</div>
<div class="row">
    <!--网站底部-->
    <div th:replace="common/public::footer"></div>
</div>
</div>
</body>

<script type="text/javascript">
    window.onload = function () {
        $("#form").bootstrapValidator({
            //默认提示
            message: 'This value is not valid',
            // 表单框里右侧的icon
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            submitHandler: function (validator, form, submitButton) {
                console.log(1);
                // 表单提交成功时会调用此方法
                // validator: 表单验证实例对象
                // form jq对象 指定表单对象
                // submitButton jq对象 指定提交按钮的对象
            },
            fields: {
                carname: {
                    message: '车辆名称验证失败',
                    validators: {
                        notEmpty: {   //不能为空
                            message: '车辆名称不能为空'
                        }
                    }
                },
                caridcard: {
                    message: '车牌号验证失败',
                    validators: {
                        notEmpty: {   //不能为空
                            message: '车牌号不能为空'
                        },
                        remote: {
                            url: '/erb/loan/carisnull',//验证地址
                            message: '车牌号已存在',//提示消息
                            type: 'POST'//请求方式
                        }
                    },
                },
                pfile: {
                    validators: {
                        notEmpty: {
                            message: '上传图片不能为空'
                        },
                        file: {
                            extension: 'png,jpg,jpeg',
                            type: 'image/png,image/jpg,image/jpeg,image/gif',
                            message: '请重新选择图片'
                        }
                    }
                }
            }
        });
    }

</script>

</html>